<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="/css/style.css" />
	</head>

	<body>
		<center>
			<h1>Wonderful tin仓库管理系统登陆界面</h1>
			<div id="app">
				<div class="container">
						<div class="form-group">
							<label>账户</label>
							<input type="text" v-model="loginModel.username" placeholder="admin@example.com" />
						</div>
						<div class="form-group">
							<label>密码</label>
							<input type="password" v-model="loginModel.password" placeholder="Admin123!" />
						</div>
						<div class="form-group">
							<label></label>
							<button @click="login">登录</button>
						</div>
				</div>
			</div>
		</center>
	</body>
	<script src="/js/vue.js"></script>
	<script src="/js/vue-resource.js"></script>

	<script>
		Vue.http.options.emulateJSON = true
		//Vue.http.options.root = 'http://211.149.193.19:8100'
		
		var demo = new Vue({
			el: '#app',
			data: {
				loginUrl: '/user/login',
				logoutUrl: 'api/Account/Logout',
				loginModel: {
                    username: '',
					password: ''
					//grant_type: 'password'
				},
				msg: '',
				userName: '1'
			},

			ready: function() {

			},
			methods: {
				login: function() {
					this.$http.post(this.loginUrl, this.loginModel)
						.then((response) => {
							var body = response.json()
							if(body.status==true){
								window.location.href="/page/main"
							}
						}).catch(this.requestError)
				},
				logout: function() {
					
					this.$http.post(this.logoutUrl)
						.then((response) => {
							this.msg = '注销成功！'
							this.userName = ''
							this.loginModel.username = ''
							this.loginModel.password = ''
							
							//sessionStorage.removeItem('userName')
							//sessionStorage.removeItem('accessToken')
							
						}).catch(this.requestError)
				},
				requestError: function(response) {
					this.msg = response.json()
				}
			}
		})
	</script>

</html>